import * as React from 'react'
import { Toast } from 'antd-mobile'
import { Gird, NavBar } from 'components'
import { showPhone } from '../methods'
import './index.less'
import { msg } from '../../../utils'

export default class Account extends React.Component<any, any> {
    public render(): JSX.Element {
        const { userInfo } = this.props
        return (
            <div className="account">
                <NavBar title="账号设置" />
                <Gird>
                    <Gird.Item title="个人信息" link={'/my/info'} />
                    <Gird.Item 
                        title={(userInfo.phone) ? '换绑手机' : '绑定手机号'} 
                        value={(userInfo.phone) ? showPhone(userInfo.phone) : ''} 
                        link={(userInfo.phone) ? '/my/editPhoneNumberVerify' : '/my/editPhoneNumber'} 
                    />
                    <Gird.Item 
                        title="实名认证" 
                        value={(userInfo.id_card && userInfo.real_name) ? '已认证' : '未认证'} 
                        link={(userInfo.id_card && userInfo.real_name) ? '' : '/My/signature'} 
                    />
                    <Gird.Item title="登录密码" value="修改" link={'/my/editPswVerify'} />
                    <Gird.Item title="支付密码" value={(userInfo.pay_pwd) ? '修改' : '未设置'} link={(userInfo.pay_pwd) ? '/my/payPswVerify' : '/My/authenticationNewPass/1'}/>
                </Gird>
                <Gird>
                    <Gird.Item title="关于我们" link={'/my/aboutUs'} />
                </Gird>
                <Gird>
                    <div className="account_exit" onClick={this.handleExit}>退出登录</div>
                </Gird>
            </div>
        )
    }

    // private handleVerifyPayPsw = () => {
    //     const { userInfo } = this.props
    //     if (userInfo.pay_pwd) {
    //         this.props.history.push('/my/payPswVerify')
    //     } else {
    //         this.props.history.push('/My/authenticationNewPass/1')
    //     }
    // }
    private handleExit = () => {
        const { SET_USER_INFO, history } = this.props
        msg('确定要退出登录?').then(() => {
            SET_USER_INFO({})
            Toast.info('退出成功', 2)
            setTimeout(() => { history.push('/') }, 2000)
        })
    }
}